<template>
	<view class="orderFood">
		<view class="top">
			<!-- 配送方式 -->
			<view class="top_type" v-if="false">
				<view @click="get_type" class="type_txt">{{typeList[typeIndex].itemName}} ></view>
				<view class="type_list" v-if="isType">
					<text @click="sel_type(index)" v-for="(item,index) in typeList" :key="index">
						{{item.itemName}}
					</text>
				</view>
			</view>
			<image class="top_bg" :src="info.picture" mode="aspectFill"></image>
			<view class="name">
				<image :src="info.picture" mode="aspectFill"></image>
				<text>{{info.title}}</text>
				<view class="like" @click="collectThis()">
					<image :src="info.myCollect == 1?'https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_icon.png':'https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_icon1.png'"
					 mode="widthFix"></image>
				</view>
			</view>
			<view class="top_con">
				<view>
					<text>评价{{info.desc_credit}} 销量{{info.monthSaleNum}} 配送约{{info.delivery_time}}分钟</text>
				</view>
				<view class="coupon" v-if="couponList.length > 0">
					<text :class="index > 0 ? 'red left' : 'red'"  v-for="(item, index) in couponList" :key="index">{{item.title}}</text>
				</view>
			</view>
		</view>
		<view v-if="navindex==0" class="content">
			<scroll-view class="left" scroll-y="true" :scroll-into-view="toView">
				<view :class="item.itemId==selCateId?'item check':'item'" v-for="(item,index) in cateList" :key="index" @click="categoryClickMain(item.itemId,index)">
					<image v-if="item.itemStatus==1" src="https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_icon2.png" mode="widthFix"></image>
					<text>{{item.itemName}}</text>
					<text class="cateItemNum" v-if="item.itemNum > 0">{{item.itemNum}}</text>
				</view>
			</scroll-view>
			<scroll-view id="showProductList" :scroll-top="scrollTop" class="right" scroll-y="true" @scroll="scrollFun" scroll-with-animation>
				<view class="item" v-for="(item,index) in productList" :key="index" :id="item.cate_id">
					<image :src="item.picture" mode="scaleToFill"></image>
					<view class="item_con">
						<text class="oneline">{{item.name}}</text>
						<text>{{item.sketch}}</text>
						<view class="goods_num">
							<text v-if="item.discount_ratio > 0">{{item.discount_ratio}} 折</text>
							<text v-if="item.min_buy > 1">每单最少{{item.min_buy}}份</text>
							<text v-if="item.max_buy > 0">每单限购{{item.max_buy}}份</text>
						</view>
						<view class="goods_pic">
							<text>
								￥{{item.adjust_price}}
							</text>
							<text v-if="item.discount_ratio > 0">原价：¥{{item.price}}</text>
						</view>
					</view>
					<view class="spec" v-if="item.base_attribute_format.length > 0" @click="selSpec(index)">
						<text>选规格</text>
						<text class="cartItemNum" v-if="item.cartTotalNum > 0">{{item.cartTotalNum}}</text>
					</view>
					<view v-else>
						<image v-if="item.cartTotalNum > 0" class="item_reduce" src="https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_noadd.png" mode="aspectFill" @click="subtract(index)"></image>
						<text v-if="item.cartTotalNum > 0" class="item_num">{{item.cartTotalNum}}</text>
						<image class="item_add" src="https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_add.png" mode="aspectFill" @click="addCart(index)"></image>
					</view>
				</view>
			</scroll-view>
		</view>
		<view @click="showCartList" class="bottom">
			<view class="bottom_coupic" v-if="false">
				已减12元
			</view>
			<view class="bottom_con">
				<view class="left">
					<view class="car">
						<image class="item_add" src="https://hdsq.aoorange.cn/attachment/xcx/icon/gouwuche.png" mode="aspectFill"></image>
						<view class="car_num">{{cartTotalNum}}</view>
					</view>
					<view class="car_pic">
						<text>￥{{cartTotalMoney}}</text>
						<text v-if="info.delivery_fee > 0">另需配送费{{info.delivery_fee}}元</text>
					</view>
				</view>
				<view class="right">
					去结算
				</view>
			</view>
		</view>
		<uni-popup ref="popup" maskClick="ture" type="bottom" animation="ture">
			<view v-if="model_type==1" class="popup_model">
				<view class="popup_top" v-if="false">
					<text>已减12元</text>
				</view>
				<view class="popup_text">
					<text>已选商品</text>
					<view class="del" @click="clearCart">
						<image src="https://hdsq.aoorange.cn/attachment/xcx/icon/del.png" mode="widthFix"></image>
						<text>清空</text>
					</view>
				</view>
				<view class="line">
					<view class="item" v-for="(item,index) in cartList" :key="index">
						<view class="left">
							<text class="oneline">{{item.product_name}}</text>
							<text>{{item.sku.name}}</text>
						</view>
						<view class="right">
							<text class="item_pic">￥{{item.adjust_price}}</text>
							<image class="item_img" @click="cartOpenate('subtract', item.sku_id, item.product_id, item.number)" src="https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_noadd.png" mode="widthFix"></image>
							<text class="item_num">{{item.number}}</text>
							<image @click="cartOpenate('add', item.sku_id, item.product_id, item.number)" src="https://hdsq.aoorange.cn/attachment/xcx/icon/orderFood_add.png" mode="widthFix"></image>
						</view>
					</view>

				</view>
				<view class="other_pic" v-if="info.packing_fee > 0">
					<text>打包费</text>
					<text>￥{{info.packing_fee}}</text>
				</view>
				<view class="bottom_con">
					<view class="left">
						<view class="car">
							<image class="item_add" src="https://hdsq.aoorange.cn/attachment/xcx/icon/gouwuche.png" mode="aspectFill"></image>
							<view class="car_num">{{cartTotalNum}}</view>
						</view>
						<view class="car_pic">
							<text>￥{{cartTotalMoney}}</text>
							<text v-if="info.delivery_fee > 0">另需配送费{{info.delivery_fee}}元</text>
						</view>
					</view>
					<view class="right" @click="subOrder()">
						去结算
					</view>
				</view>
			</view>
			<view v-else class="popup_model1">
				<image @click="close" class="close" src="https://hdsq.aoorange.cn/attachment/xcx/icon/close1.png" mode="aspectFill"></image>
				<view>
					<view class="goods_info">
						<image :src="selAttr.picture" mode="aspectFill"></image>
						<view class="right">
							<text>￥{{selAttr.price}}</text>
							<view class="goods_num">
								<text>库存：{{selAttr.stock}}件</text>
								<text v-if="selAttr.data_name != ''">已选：{{selAttr.data_name}}</text>
							</view>
						</view>
					</view>
					<view class="goods_size" v-if="index<1" v-for="(item, index) in attributeList" :key="index">
						<text class="title">{{item.name}}</text>
						<view class="size_item">
							<text :class="selAttrList[item.id] && selAttrList[item.id] == attrVal.base_spec_value_id ?'sel':'nosel'" v-for="(attrVal,index1) in item.value" :key="index1" @click="selAttrFun(index, index1)">{{attrVal.title}}</text>
						</view>
					</view>
					<view class="goods_num1">
						<text>购买数量</text>
						<view class="uni-numbox">
							<view class="uni-numbox-minus" :class="disableSubtract ? '' : 'uni-numbox-disabled'" @click="_calcValue('subtract')">-</view>
							<view class="uni-numbox-value" >{{inputValue}}</view>
							<view class="uni-numbox-plus" :class="disableAdd ? '' : 'uni-numbox-disabled'" @click="_calcValue('add')">+</view>
						</view>
					</view>
					<view class="goods_bot" @click="subSel()">选好了</view>
				</view>
			</view>

		</uni-popup>
	</view>
</template>

<script>
	import serve from '../static/request.js';
	import storage from '../static/appkey.js';
	import common from '../static/jump.js';
	export default {
		data() {
			return {
				isType:false,//是否显示配送类型
				typeIndex:0,//选择配送类型编号
				typeList:[
					{itemId:'lobby_eat',itemName:"堂食"}, 
					{itemId:'take_out',itemName:"外卖配送"}, 
					{itemId:'me_take',itemName:"点单"},
				],//配送类型
				sel: true,
				navindex: 0,
				model_type: 2,
				islike: false,
				navList: ["点餐"],
				dataList: ["热销", "优 惠", "特惠套餐", "经典套餐", "满减套餐", ],
				commentlist: ["全部999+", "最新", "好评997", "中评1", "差评1"],
				merchantId: 0,
				type: '',
				info: {
					desc_credit: 5,
					monthSaleNum: 0,
					delivery_time: 60,
				},
				couponList: [],
				cateList: [],
				productList: [],
				selCateId : 0,
				cateHeight: [],
				toView: '',
				cartTotalNum: 0,
				cartTotalMoney: 0,
				cartList: [],
				selSpecKey: 0,
				attributeList: [],
				skuList: [],
				selAttrList: [],
				selAttr:{
					'picture' : '',
					'price' : '',
					'point_exchange': '',
					'stock' : '',
					'data' : '',
					'data_name' : '',
				},
				selSkuId: 0,
				inputValue: 1,
				isSelNum : true,
				scrollTop:0,
			}
		},
		methods: {
			open() {
				this.$refs.popup.open();
			},
			close() {
				this.$refs.popup.close();
			},
			scrollFun(e) {
				let scrollHeight = Number(e.detail.scrollTop) + 10;
				for(let i in this.cateHeight) {
					let height = this.cateHeight[i].height;
					console.info(scrollHeight + '-->' + height);
					if(scrollHeight < height) {
						this.selCateId = this.cateHeight[i].cateId;
						return false;
					}
					if(scrollHeight >= height) {
						let j = i * 1 + 1 * 1;
						this.selCateId = this.cateHeight[i].cateId;
					}
				}
			},
			categoryClickMain(cateId,index) {
				this.selCateId = cateId;
				var query = uni.createSelectorQuery().in(this);
				var scrollHeight = this.cateHeight[index];
				if(index==0){
					this.scrollTop=0;
					return true;
				}
				for(let i in this.cateHeight) {
					if(this.cateHeight[i].cateId == this.selCateId) {
						let j = i - 1;
						this.scrollTop = this.cateHeight[j].height + 20;
						return false;
					}
				}
			},
			getInfo() {
				var self = this;
				console.log('getInfo');
				serve
					.request({
						url: '/marketing/merchant/view',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							'local-city':uni.getStorageSync('localCity'),
							id: self.merchantId,
						}
					})
					.then(res => {
						console.log(res);
						if(res.code != 200) {
							uni.showToast({
								title: res.message,
								icon : 'none',
								success:function(){ 
									setTimeout(function () { 
										common.jump('store_list')
									}, 2000) 
								} 
							});
							return;
						}
						self.info = res.data;
						
					});
			},
			getCouponList(){
				var self = this;
				serve
					.request({
						url: '/marketing/coupon-type/index',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: 3,
						}
					})
					.then(res => {
						self.couponList = res.data;
						self.$forceUpdate();
					});
			},
			getCateProductList() {
				var self = this;
				serve
					.request({
						url: '/marketing/product/index',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: self.type,
						}
					})
					.then(res => {
						self.cateList = res.data.cateList;
						self.selCateId = self.cateList[0].itemId;
						self.productList = res.data.productList;
						let temp = [];
						self.productList.forEach((item, index) => {
							self.$set(temp, item.cate_id, (index * 1 + 1 * 1) * 100);
						});
						for(let i in temp) {
							self.cateHeight.push({'cateId': i, 'height': temp[i]});
						}
						console.info(self.cateHeight);
						self.updateCartTotalNum();
						self.$forceUpdate();
					});
			},
			addCart(key) {
				var productItem = this.productList[key];
				var skuId = productItem.sku[0].id;
				var num = 1;
				this.addCartFun(key, skuId, num >= productItem.min_buy ? 1 : productItem.min_buy);
			},
			addCartFun(key, skuId, num) {
				if(uni.getStorageSync('access-token') == '') {
					this.jump('login');
					return ;
				}
				
				uni.showLoading({
					title: '操作中···',
					mask: true
				});
				var self =this;
				serve
					.request({
						url: '/member/cart-item/create',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: self.type,
							'sku_id': skuId,
							num: num
						}
					})
					.then(res => {
						uni.showToast({
							title: res.message,
							icon : 'none'
						});
						if(res.code == 200) {
							var productItem = self.productList[key];
							var cartList = productItem.cartList;
							cartList.forEach((item, i) => {
								if(item.sku_id == skuId) {
									let newNum = Number(item.num) + Number(num);
									self.$set(self.productList[key].cartList[i], 'num', newNum);
								}
							});
							let nowTotalNum = Number(productItem.cartTotalNum) + Number(num);
							self.$set(self.productList[key], 'cartTotalNum', nowTotalNum)
							self.cateList.forEach((item, i) => {
								if(item.itemId == productItem.cate_id) {
									let nowNum = self.cateList[i].itemNum;
									self.$set(self.cateList[i], 'itemNum', Number(nowNum) + Number(num));
								}
							});
							self.updateCartTotalNum();
							self.$forceUpdate();
							uni.hideLoading();
						}
					});
			},
			subtract(key) {
				var productItem = this.productList[key];
				var skuId = productItem.sku[0].id;
				var num = 0;
				var cartList = productItem.cartList;
				cartList.forEach((item, i) => {
					if(item.sku_id == skuId) {
						num = Number(item.num) - 1;
					}
				});
				let delNum = 1;
				if(num > 0 && productItem.min_buy > 0 && num < productItem.min_buy) {
					num = 0;
					delNum = num;
				}
				if(num == 0) {
					this.delCartFun(key, skuId, delNum);
					return ;
				} 
				this.updateCartFun(key, skuId, num);
			},
			updateCartFun(key, skuId, num) {
				if(uni.getStorageSync('access-token') == '') {
					this.jump('login');
					return ;
				}
				uni.showLoading({
					title: '操作中···',
					mask: true
				});
				var self =this;
				serve
					.request({
						url: '/member/cart-item/update-num',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: self.type,
							'sku_id': skuId,
							num: num
						}
					})
					.then(res => {
						uni.showToast({
							title: res.message,
							icon : 'none'
						});
						if(res.code == 200) {
							var productItem = self.productList[key];
							var cartList = productItem.cartList;
							var is_sel = false;
							var nowTotalNum = 0;
							cartList.forEach((item, i) => {
								if(item.sku_id == skuId) {
									nowTotalNum = Number(nowTotalNum) + Number(num);
									self.$set(self.productList[key].cartList[i], 'num', num);
									is_sel = true;
								} else {
									nowTotalNum = Number(nowTotalNum) + Number(item.num);
								}
							});
							if(!is_sel) {
								let nowSku = {'sku_id':skuId, 'num':num};
								self.productList[key].cartList.push(nowSku);
								nowTotalNum = Number(nowTotalNum) + Number(num);
							}
							// let nowTotalNum = productItem.cartTotalNum;
							self.$set(self.productList[key], 'cartTotalNum', nowTotalNum)
							self.cateList.forEach((item, i) => {
								if(item.itemId == productItem.cate_id) {
									let nowNum = self.cateList[i].itemNum;
									self.$set(self.cateList[i], 'itemNum', Number(nowNum) - Number(1));
								}
							});
							self.updateCartTotalNum();
							uni.hideLoading();
							self.$forceUpdate();
						}
					});
			},
			delCartFun(key, skuId, num) {
				if(uni.getStorageSync('access-token') == '') {
					this.jump('login');
					return ;
				}
				uni.showLoading({
					title: '操作中···',
					mask: true
				});
				var self =this;
				serve
					.request({
						url: '/member/cart-item/delete-ids',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: self.type,
							'sku_ids': skuId,
						}
					})
					.then(res => {
						uni.showToast({
							title: res.message,
							icon : 'none'
						});
						if(res.code == 200) {
							var productItem = self.productList[key];
							var cartList = productItem.cartList;
							var is_sel = false;
							var nowTotalNum = 0;
							cartList.forEach((item, i) => {
								if(item.sku_id == skuId) {
									self.$set(self.productList[key].cartList[i], 'num', 0);
									is_sel = true;
								} else {
									nowTotalNum = Number(nowTotalNum) + Number(item.num);
								}
							});
							// let nowTotalNum = productItem.cartTotalNum;
							self.$set(self.productList[key], 'cartTotalNum', nowTotalNum)
							self.cateList.forEach((item, i) => {
								if(item.itemId == productItem.cate_id) {
									let nowNum = self.cateList[i].itemNum;
									self.$set(self.cateList[i], 'itemNum', Number(nowNum) - Number(num));
								}
							});
							self.updateCartTotalNum();
							uni.hideLoading();
							self.$forceUpdate();
						}
					});
			},
			selSpec(key) {
				var productItem = this.productList[key];
				this.selSpecKey = key;
				this.selAttr.picture = productItem.picture;
				this.selAttr.price = productItem.price;
				this.selAttr.point_exchange = productItem.point_exchange;
				this.selAttr.stock = productItem.stock;
				this.attributeList = productItem.base_attribute_format;
				this.skuList = productItem.sku;
				this.inputValue = productItem.min_buy;
				this.selSkuId = 0;
				let name = '';
				let data = '';	
				this.attributeList.forEach((item, key) => {
					item.value.forEach((item2, key2) => {
						if(key2 == 0) {
							this.$set(this.selAttrList, item.id, item2.base_spec_value_id);
							name += item2.title + ' ';
							data = data ? data + '-'+item2.base_spec_value_id : item2.base_spec_value_id;
						}
					});
				});
				this.selAttr.data_name = name;
				this.skuList.forEach((item, key) => {
					if(item.data == data) {
						this.selSkuId = item.id;
						this.selAttr.picture = item.picture;
						this.selAttr.price = item.price;
						this.selAttr.stock = item.stock;
						return ;
					}
				});
				this.model_type = 2;
				this.open();
			},
			selAttrFun(index, index1) {
				this.$set(this.selAttrList, this.attributeList[index].id,  this.attributeList[index].value[index1].base_spec_value_id);
				let name = '';
				let data = '';		
				this.attributeList.forEach((item, key) => {
					if(this.selAttrList[item.id]){
						item.value.forEach((attrVal, key) => {
							if(attrVal.base_spec_value_id == this.selAttrList[item.id]) {
								name += attrVal.title + ' ';
								data = data ? data + '-'+attrVal.base_spec_value_id : attrVal.base_spec_value_id;
							}
						});
					}
				});
				this.selAttr.data_name = name;
				var productItem = this.productList[this.selSpecKey];
				this.skuList.forEach((item, key) => {
					if(item.data == data) {
						this.selSkuId = item.id;
						this.selAttr.picture = item.picture;
						this.selAttr.price = item.price;
						this.selAttr.stock = item.stock;
						productItem.cartList.forEach((item2, key2) => {
							if(item2.sku_id == this.selSkuId && item2.num > 0) {
								this.inputValue = item2.num;
							}
						});
						return ;
					}
				});
			},
			_calcValue(type) {
				if(this.selSkuId == 0) {
					uni.showToast({
						title: '请选择商品规格',
						icon : 'none'
					});
					return ;
				}
				var productItem = this.productList[this.selSpecKey];
				const scale = productItem.min_buy;  
				let value = this.inputValue;  
				let max = productItem.max_buy > 0 ? productItem.max_buy : this.selAttr.stock;
				if (type === 'subtract') {  
					value -= 1  
				} else if (type === 'add') {  
					value = parseInt(Number(value) + Number(1))
				}  
				if (value < productItem.min_buy) {  
					return  
				}  
				if(productItem.max_buy > 0) {
					return
				}
				if(value > productItem.max_buy) {
					uni.showToast({
						title: '每单限购'+productItem.max_buy+'份',
						icon : 'none'
					});
					this.inputValue = productItem.max_buy; 
					this.disableAdd = false;
					return
				}
				if(value == this.min) {
					this.disableSubtract = false;
				}
				if(value == this.max) {
					this.disableAdd = false;
				}
				this.inputValue = value;  
			},   
			subSel() {
				if(this.selSkuId == 0) {
					uni.showToast({
						title: '请选择商品规格',
						icon : 'none'
					});
					return ;
				}
				if(uni.getStorageSync('access-token') == '') {
					this.jump('login');
					return ;
				}
				var productItem = this.productList[this.selSpecKey];
				var is_in_cart = false;
				productItem.cartList.forEach((item, key) => {
					if(item.sku_id == this.selSkuId && item.num > 0) {
						is_in_cart = true;
					}
				});
				this.isSelNum = true;
				if(is_in_cart) {
					this.updateCartFun(this.selSpecKey, this.selSkuId, this.inputValue);
				} else {
					this.addCartFun(this.selSpecKey, this.selSkuId, this.inputValue);
				}
				this.close();
			},
			updateCartTotalNum() {
				var self = this;
				serve
					.request({
						url: '/marketing/cart-item/index',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: self.type,
						}
					})
					.then(res => {
						self.cartTotalNum = res.data.totalNum;
						self.cartTotalMoney = res.data.totalMoney;
						self.cartList = res.data.cartList;
						self.$forceUpdate();
					});
			},
			showCartList() {
				this.model_type = 1;
				this.open();
			},
			cartOpenate(type, skuId, productId, num) {
				let key = 0;
				let productItem;
				this.productList.forEach((item, index) => {
					if(item.id == productId) {
						key = index;
						productItem = item;
					}
				});
				let newNum = 0;
				if(type == 'subtract') {
					newNum = num - 1;
				} else {
					newNum = Number(num) + Number(1);
				}
				if(newNum == 0 || newNum < productItem.min_buy) {
					this.delCartFun(key, skuId, newNum == 0 ? num : productItem.min_buy);
				} else {
					this.updateCartFun(key, skuId, newNum);
				}
			},
			clearCart(){
				var self = this;
				serve
					.request({
						url: '/member/cart-item/clear',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							merchantId: self.merchantId,
							type: self.type,
						}
					})
					.then(res => {
						self.cartTotalNum = 0;
						self.cartTotalMoney = 0;
						self.cartList = [];
						self.cateList.forEach((item, index) => {
							self.$set(self.cateList[index], 'itemNum', 0);
						});
						self.productList.forEach((item, index) => {
							self.$set(self.productList[index], 'cartTotalNum', 0);
							item.cartList.forEach((item2, index2) => {
								self.$set(self.productList[index].cartList[index2], 'num', 0);
							});
						});
						self.$forceUpdate();
					});
			},
			collectThis(){
				if(uni.getStorageSync('access-token') == '') {
					this.jump('login');
					return ;
				}
				uni.showLoading({
					title: '操作中···',
					mask: true
				});
				serve
					.request({
						url: '/common/collect/operate',
						data: {
							appkey: uni.getStorageSync('appkey'),
							'access-token': uni.getStorageSync('access-token'),
							type: 'merchant',
							id : this.merchantId
						}
					})
					.then(res => {
						if(res.code == 200) {
							this.info.myCollect = this.info.myCollect == 1 ? 0 : 1;
						} else {
							uni.showToast({
								title: res.message,
								icon : 'none'
							});
						}
						uni.hideLoading();
					});
			},
			subOrder() {
				let cartIds = '';
				this.cartList.forEach((item, index) => {
					cartIds += item.id + ',';
				});
				uni.navigateTo({
				    url: '/pages/merchant/takeOrder?type=cart&order_type=3&data='+cartIds
				});
			},
			jump(jump_type, jump_link){
				common.jump(jump_type, jump_link);
			}
		},
		onLoad(options) {
			this.merchantId = options.id || 0;
			this.type = 3;
			if(this.merchantId == 0) {
				uni.showToast({
					title: "错误的访问方式",
					icon: 'none',
					success() {
						setTimeout(function () {
							common.jump('return_one');
						}, 2000) 
					}
				});
				return ;
			}
			this.getInfo();
			this.getCouponList();
			this.getCateProductList();
		},
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function() {
				uni.stopPullDownRefresh(); //结束下拉加载状态
			}, 1000);
		}
	}
</script>

<style scoped lang="scss">
	.orderFood {
		padding-bottom: 180upx;
		background: rgba(153, 153, 153, 0.04);
		min-height: 100vh;

		.popup_model {
			position: fixed;
			bottom: 0upx;
			width: 100%;
			background: #FFFFFF;

			.popup_top {
				width: 100%;
				height: 80upx;
				background: rgba(247, 240, 238, 1);
				color: #EB5938;
				font-size: 24upx;
				line-height: 80upx;
				text-align: center;
			}

			.popup_text {
				box-sizing: border-box;
				padding: 43upx 30upx 0upx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 24upx;
				color: #999999;

				.del {
					display: flex;
					align-items: center;
					color: #CCCCCC;

					image {
						width: 32upx;
						height: 31upx;
						margin-right: 11upx;
					}
				}
			}

			.line {
				box-sizing: border-box;
				padding: 55upx 30upx;
				border-bottom: 1upx #EBECF0 solid;

				.item {
					display: flex;
					justify-content: space-between;
					padding-bottom: 37upx;

					.left {
						display: flex;
						flex-direction: column;

						text:nth-child(1) {
							font-size: 32upx;
							font-weight: bold;
							color: rgba(51, 51, 51, 1);
						}

						text:nth-child(2) {
							font-size: 20upx;
							color: #999999;
							margin-top: 16upx;
						}
					}

					.right {
						display: flex;
						align-items: center;

						.item_pic {
							font-size: 28upx;
							color: #EB5938;
							font-weight: bold;
						}

						.item_num {
							font-size: 36upx;
							color: #333333;
							font-weight: bold;
							padding: 0upx 30upx;
						}

						image {
							width: 40upx;
							height: 40upx;
						}

						.item_img {
							margin-left: 23upx;
						}
					}
				}
			}

			.other_pic {
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 80upx;
				padding: 0upx 30upx;
				box-sizing: border-box;

				text:nth-child(1) {
					color: #333333;
					font-size: 28upx;
				}

				text:nth-child(2) {
					color: #EB5938;
					font-size: 28upx;
					font-weight: bold;
				}
			}

			.bottom_con {
				width: 100%;
				display: flex;
				justify-content: space-between;
				height: 100upx;
				background: #FFFFFF;
				border-top: 1upx #EBECF0 solid;

				.left {
					height: 100upx;
					display: flex;
					align-items: center;

					.car {
						margin-left: 28upx;
						position: relative;

						image {
							width: 44upx;
							height: 41upx;
						}

						.car_num {
							position: absolute;
							top: -10upx;
							right: -10upx;
							background-color: #EB5938;
							border-radius: 50%;
							font-size: 14upx;
							color: #FFFFFF;
							width: 20upx;
							height: 20upx;
							text-align: center;
							line-height: 20upx;
							padding: 4upx;
						}
					}

					.car_pic {
						display: flex;
						flex-direction: column;
						margin-left: 33upx;

						text:nth-child(1) {
							color: #EB5938;
							font-size: 32upx;
							font-weight: bold;
						}

						text:nth-child(2) {
							color: #999999;
							font-size: 20upx;
						}
					}
				}

				.right {
					width: 240upx;
					height: 100upx;
					line-height: 100upx;
					color: #FFFFFF;
					font-size: 28upx;
					text-align: center;
					background: rgba(235, 89, 56, 1);
				}
			}
		}

		.popup_model1 {
			position: fixed;
			width: 100%;
			background: #FFFFFF;
			bottom: 0upx;
			z-index: 999;

			.close {
				position: absolute;
				width: 23upx;
				height: 23upx;
				top: 50upx;
				right: 40upx;
			}

			.goods_info {
				display: flex;
				padding: 50upx 30upx;
				box-sizing: border-box;
				width: 100%;

				image {
					width: 170upx;
					height: 170upx
				}

				.right {
					display: flex;
					flex-direction: column;
					justify-content: center;
					color: #FF5F60;
					font-size: 32upx;
					margin-left: 18upx;

					.goods_num {
						display: flex;
						flex-direction: column;
						font-size: 20upx;
						color: rgba(153, 153, 153, 1);
						margin-top: 20upx;
					}
				}
			}

			.goods_size {
				padding: 0upx 0upx 0upx 30upx;
				box-sizing: border-box;

				.title {
					font-size: 32upx;
					margin-left: 13upx;
					color: #999999;
				}

				.size_item {
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-;
					padding: 15upx 0upx 27upx;
					font-size: 28upx;

					.sel {
						width: 210upx;
						height: 64upx;
						line-height: 64upx;
						text-align: center;
						background: rgba(245, 245, 245, 1);
						border-radius: 32upx;
						margin-right: 30upx;
						margin-top: 12upx;
						color: #FFFFFF;
						background: #FFBC00;
					}

					.nosel {
						width: 210upx;
						height: 64upx;
						margin-right: 30upx;
						line-height: 64upx;
						text-align: center;
						background: rgba(245, 245, 245, 1);
						border-radius: 32upx;
						margin-top: 12upx;

						color: rgba(57, 72, 107, 0.8);
					}
				}
			}

			.goods_num1 {
				padding: 20upx 30upx 63upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				font-size: 32upx;
				color: #999999;

				.uni-numbox {
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					height: 64upx;
				}

				.uni-numbox-minus,
				.uni-numbox-plus {
					margin: 0;
					background-color: #FFFFFF;
					width: 100upx;
					height: 100%;
					line-height: 64upx;
					text-align: center;
					color: #CCCCCC;
				}

				.uni-numbox-minus {
					border: 1upx solid rgba(60, 72, 104, 0.1);
					border-right: none;
					border-top-left-radius: 32upx;
					border-bottom-left-radius: 32upx;
				}

				.uni-numbox-plus {
					border: 1upx solid rgba(60, 72, 104, 0.1);
					border-left: none;
					border-top-right-radius: 32upx;
					border-bottom-right-radius: 32upx;
				}

				.uni-numbox-value {
					border: 1upx solid rgba(60, 72, 104, 0.1);
					background-color: #ffffff;
					width: 100upx;
					height: 66upx;
					line-height: 66upx;
					text-align: center;
				}

				.uni-numbox-disabled {
					color: #c0c0c0;
				}
			}

			.goods_bot {
				width: 100%;
				height: 100upx;
				line-height: 100upx;
				text-align: center;
				font-size: 32upx;
				color: #FFFFFF;
				background: #FFBC00;
			}
		}

		.top {
			position: relative;
			.top_type{
				position: absolute;
				z-index: 100;
				top: 225upx;
				left: 30upx;
				.type_txt{
					width:150upx;
					text-align: center;
					height:40upx;
					font-size:24upx;
					color: #FFFFFF;
					line-height: 40upx;
					background:rgba(235,89,56,1);
					opacity:0.8;
				}
				.type_list{
					padding: 20upx 0upx;
					position: absolute;
					left:-15upx;
					top: 46upx;
					display: flex;
					flex-direction: column;	
					font-size:24upx;
					color:#666666;
					width:180upx;
					background:rgba(255,255,255,1);
					box-shadow:0upx 2upx 6upx 0upx rgba(0, 0, 0, 0.08);
				    text{
						line-height:64upx;
						margin-left: 40upx;
					}
				}
			}
			.top_bg {
				width: 100%;
				height: 260upx;
			}

			.name {
				width: 100%;
				position: relative;
				margin-top: -92upx;
				display: flex;
				flex-direction: column;
				align-items: center;
				font-size: 28upx;
				color: #333333;
				position: absolute;

				image {
					width: 160upx;
					height: 160upx;
				}

				text {
					margin-top: 23upx;
				}

				.like {
					display: flex;
					justify-content: center;
					align-items: center;
					position: absolute;
					right: 137upx;
					top: 50upx;
					width: 70upx;
					height: 70upx;
					background: rgba(255, 255, 255, 1);
					border-radius: 50%;

					image {
						width: 39upx;
						height: 34upx;
					}
				}
			}

			.search {
				margin-top: 128upx;
				box-sizing: border-box;
				padding: 40upx;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.search_con {
					width: 560upx;
					height: 72upx;
					background: rgba(245, 245, 245, 1);
					border-radius: 36upx;
					display: flex;
					align-items: center;

					image {
						width: 22upx;
						height: 22upx;
						margin-left: 116upx;
					}

					input {
						font-size: 24upx;
						margin-left: 20upx;
					}
				}

				.search_txt {
					font-size: 32upx;
					color: #FFBC00;
				}
			}

			.top_con {
				box-sizing: border-box;
				padding: 0upx 30upx 40upx;
				color: #333;
				font-size: 26upx;
				margin-top: 140upx;
				
				.coupon {
					padding: 14upx 0upx 18upx;

					.red {
						color: #EB5938;
						border: 1upx #EB5938 solid;
						padding: 0upx 4upx;
					}

					.left {
						margin-left: 10upx;
					}
				}

			}
		}

		.nav {
			border-bottom: 1upx rgba(153, 153, 153, 0.04) solid;
			border-top: 1upx rgba(153, 153, 153, 0.04) solid;
			width: 100%;
			height: 92upx;
			display: flex;
			align-items: center;
			background: #FFFFFF;

			.item {
				text-align: center;
				position: relative;
				width: 33.3%;
				line-height: 92upx;
				font-size: 32upx;
				color: #999999;

				text:nth-child(2) {
					font-size: 20upx;
					margin-left: 8upx;
				}
			}

			.check {
				color: #232323;
			}

			.check::after {
				content: "";
				position: absolute;
				bottom: 0;
				width: 30upx;
				height: 7upx;
				background: rgba(255, 188, 0, 1);
				border-radius: 3upx;
				left: 44%
			}
		}

		.content {
			display: flex;

			.left {
				height: 626upx;
				background: #FFFFFF;
				width: 160upx;

				.item {
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 24upx;
					height: 100upx;
					border-bottom: 1upx #EBEBEB solid;
					color: #666666;

					image {
						width: 22upx;
						height: 26upx;
						margin-right: 6upx;
					}
				}
				.cateItemNum {
					position: absolute;
					right: 0;
					background-color: #EB5938;
					border-radius: 50%;
					font-size: 14upx;
					color: #FFFFFF;
					width: 20upx;
					height: 20upx;
					text-align: center;
					line-height: 20upx;
					padding: 4upx;
				}
				.check {
					background: #FBFBFB;
					color: #333333;
					font-weight: bold;
				}
			}

			.right {
				height: 626upx;
				width: 600upx;
				box-sizing: border-box;
				padding: 0upx 10upx;

				.item {
					width: 600upx;
					position: relative;
					display: flex;
					box-sizing: border-box;
					padding: 24upx 0upx;
					border-bottom: 1upx #EBEBEB solid;
					.spec {
						font-size: 22upx;
						border: 2upx #FBCA3F solid;
						position: absolute;
						bottom: 24upx;
						right: 20upx;
						padding: 6upx;
						background: #FBCA3F;
						width: 100upx;
						text-align: center;
						.cartItemNum {
							position: absolute;
							right: -6upx;
							top: -6upx;
							background-color: #EB5938;
							border-radius: 50%;
							font-size: 14upx;
							color: #FFFFFF;
							width: 20upx;
							height: 20upx;
							text-align: center;
							line-height: 20upx;
							padding: 4upx;
						}
					}
					.item_reduce {
						position: absolute;
						bottom: 24upx;
						width: 40upx;
						height: 40upx;
						right: 100upx;
					}
					.item_num{
						font-size: 22upx;
						position: absolute;
						bottom: 24upx;
						right: 70upx;
						padding: 6upx;
						border: 2upx #fbca3f solid;
						width: 30upx;
						text-align: center;
					}
					.item_add {
						position: absolute;
						bottom: 24upx;
						width: 40upx;
						height: 40upx;
						right: 0upx;
					}

					image {
						width: 160upx;
						height: 160upx;
						margin-right: 24upx;
					}

					.item_con {
						display: flex;
						flex-direction: column;
						justify-content: space-between;

						text:nth-child(1) {
							max-width: 310upx;
							font-size: 32upx;
							color: #333333;
							font-weight: bold;
						}

						text:nth-child(2) {
							font-size: 20upx;
							color: #999999;
						}

						.goods_num {
							display: flex;
							align-items: center;

							text:nth-child(1) {
								color: #EB5938;
								border: 1upx #EB5938 solid;
								font-size: 20upx;
								padding: 0upx 4upx;
								font-weight: 400;
							}

							text:nth-child(2) {
								color: #EB5938;
								margin-left: 8upx;
							}
						}

						.goods_pic {
							display: flex;
							align-items: center;

							text:nth-child(1) {
								color: #EB5938;
								font-size: 28upx;
							}

							text:nth-child(2) {
								color: #CCCCCC;
								font-size: 20upx;
								margin-left: 8upx;
								text-decoration: line-through;
							}
						}
					}
				}
			}
		}

		.content1 {
			.comment_info {
				.comment_grade {
					box-sizing: border-box;
					padding: 41upx 30upx;
					justify-content: space-between;
					display: flex;
					align-items: center;
					border-bottom: 1upx rgba(204, 204, 204, 0.3) solid;

					.left {
						display: flex;
						align-items: center;
						color: #FFBC00;
						font-size: 60upx;
						font-weight: bold;

						.left_txt {
							margin-left: 18upx;
							color: #999999;
							font-size: 24upx;
							font-weight: 400;

							.rate {
								margin-top: 12upx;
							}
						}
					}

					.right {
						display: flex;
						align-items: center;
						color: #999999;
						font-size: 20upx;

						.sel {
							background-image: url(https://hdsq.aoorange.cn/attachment/xcx/icon/xuanzhong.png);
							background-repeat: no-repeat;
							width: 32upx;
							height: 32upx;
							background-size: 100%;
							margin-right: 9upx;
						}

						.nosel {
							width: 28upx;
							height: 28upx;
							border: 1upx solid #999999;
							border-radius: 50%;
							margin-right: 9upx;
						}
					}
				}

				::-webkit-scrollbar {
					display: none;
				}

				.scroll {
					width: calc(100% - 60upx);
					padding: 24upx 30upx;
					border-bottom: 1upx rgba(204, 204, 204, 0.3) solid;
					white-space: nowrap;

					.scroll-item:first-child {
						margin-left: 0upx;
					}

					.scroll-item {
						display: inline-flex;
						margin-left: 17upx;
						font-size: 28upx;
						color: #999999;
						border-radius: 40upx;
						background: #F5F5F5;
						padding: 16upx 41upx;
					}

					.check {
						background: #FFF9E8;
						border: 1px solid rgba(255, 188, 0, 1);
						color: #FFBC00;
					}
				}

			}

			.comment {
				.item {
					display: flex;
					box-sizing: border-box;
					padding: 50upx 30upx;
					border-bottom: 1upx #EBECF0 solid;

					.left {
						image {
							width: 60upx;
							height: 60upx;
							border-radius: 50%;
						}
					}

					.right {
						margin-left: 13upx;
						width: 617upx;

						.name {
							display: flex;
							align-items: center;
							justify-content: space-between;

							.txt {
								display: flex;
								align-items: center;

								text:nth-child(1) {
									font-size: 28upx;
									font-weight: bold;
									color: #333333;
								}

								text:nth-child(2) {
									color: #999999;
									font-size: 20upx;
									margin-left: 25upx;
								}
							}

							.txt1 {
								color: #EB5938;
								font-size: 28upx;
							}
						}

						.txt2 {
							font-size: 28upx;
							color: #666666;
							margin-top: 30upx;
						}

						.comment_img {
							display: flex;

							image:first-child {
								margin-left: 0;
							}

							image {
								width: 190upx;
								height: 168upx;
								margin-top: 30upx;
								margin-left: 22upx;
							}
						}

						.txt3 {
							margin-top: 30upx;
							width: 614upx;
							box-sizing: border-box;
							background: rgba(240, 240, 240, 1);
							padding: 23upx 20upx 29upx;
							font-size: 28upx;
							color: #999999;

							text:first-child {
								font-weight: bold;
							}
						}
					}
				}

			}

		}
        .content2{
			padding-bottom: 52upx;
			.merchant_info{
				box-sizing: border-box;
				padding: 30upx;
				border-bottom: 12upx #F5F5F5 solid;
				.merchant_tilte{
					color: #232323;
					font-size: 32upx;
					font-weight: bold;
				}
				::-webkit-scrollbar {
					display: none;
				}
				
				.scroll {
					width: 100%;
					padding: 25upx 0upx;
					white-space: nowrap;			
					.scroll-item:first-child {
						margin-left: 0upx;
					}
				
					.scroll-item {
						display: inline-flex;
						margin-left: 15upx;
						image{
							width:200upx;
							height:160upx;
						}
					}
				
				}
				.merchant_txt{
					font-size: 28upx;
					color: #999999;
				}
			}
		    .line{
				border-bottom: 1upx #EBECF0 solid;
				display: flex;
				box-sizing: border-box;
				padding: 36upx 30upx;
				justify-content: space-between;
				text:nth-child(1){
					color: #999999;
					font-size: 28upx;
				}
				text:nth-child(2){
					max-width:421upx ;
					font-weight: bold;
					color: #333333;
					font-size: 32upx;
				}
			}
		}
		.bottom {
			width: 100%;
			position: fixed;
			bottom: 0upx;

			.bottom_coupic {

				width: 100%;
				height: 80upx;
				line-height: 80upx;
				color: #EB5938;
				font-size: 24upx;
				text-align: center;
				background: rgba(247, 240, 238, 1);
			}

			.bottom_con {
				width: 100%;
				display: flex;
				justify-content: space-between;
				height: 100upx;
				background: #FFFFFF;
				border-top: 1upx #EBECF0 solid;

				.left {
					height: 100upx;
					display: flex;
					align-items: center;

					.car {
						margin-left: 28upx;
						position: relative;

						image {
							width: 44upx;
							height: 41upx;
						}

						.car_num {
							position: absolute;
							top: -10upx;
							right: -10upx;
							background-color: #EB5938;
							border-radius: 50%;
							font-size: 14upx;
							color: #FFFFFF;
							width: 20upx;
							height: 20upx;
							text-align: center;
							line-height: 20upx;
							padding: 4upx;
						}
					}

					.car_pic {
						display: flex;
						flex-direction: column;
						margin-left: 33upx;

						text:nth-child(1) {
							color: #EB5938;
							font-size: 32upx;
							font-weight: bold;
						}

						text:nth-child(2) {
							color: #999999;
							font-size: 20upx;
						}
					}
				}

				.right {
					width: 240upx;
					height: 100upx;
					line-height: 100upx;
					color: #FFFFFF;
					font-size: 28upx;
					text-align: center;
					background: rgba(235, 89, 56, 1);
				}
			}
		}
	}
</style>
